import React, { Component } from 'react';
import { Table, Row, Button, Modal } from 'antd';

const colunms = [
	{
		title: '标题',
		dataIndex: 'title',
		key: 'title'
	},
	{
		title: '发明人',
		dataIndex: 'creator',
		key: 'creator'
	},
	{
		title: '申请人',
		dataIndex: 'proposer',
		key: 'proposer'
	},
	{
		title: '申请日',
		dataIndex: 'date',
		key: 'date'
	},
	{
		title: '申请号',
		dataIndex: 'id',
		key: 'id'
	}
];

let dataSource = [
	{
		key: '1',
		title: '一种连续供药喷酒农药无人机',
		creator: '林建',
		proposer: '上海交通大学无锡研究院',
		date: '2012.11.13',
		id: '201220595287.3'
	},
	{
		key: '2',
		title: '基于直升飞机的高原灭蝗农药喷洒',
		creator: '唐川江;周万强;周俗;张新跃..',
		proposer: '四川省草原工作总站;中国...',
		date: '2009.02.07',
		id: '200920079295'
	}
];

let tarLink = 'https://lantern.oss-cn-qingdao.aliyuncs.com/QQ20180810-OCR-0.zip';

export default class CollectTable extends Component {
	constructor(props) {
		super(props);
		this.state = {
			selectedRowKeys: [],
			dataSource,
			tarloading: false
		};
	}
	onDelete() {
		Modal.confirm({
			title: '确定删除吗',
			content: '此操作不可恢复',
			onOk: () => {
				this.setState({
					dataSource: this.state.dataSource.filter((item) => !this.state.selectedRowKeys.includes(item.key)),
					selectedRowKeys: []
				});
			}
		});
	}
	onChange(selectedRowKeys) {
		this.setState({
			selectedRowKeys
		});
	}
	onDownload() {
		this.setState({
			tarloading: true
		});
		const aLink = document.createElement('a');
		aLink.href = tarLink;
		document.body.appendChild(aLink);
		setTimeout(() => {
			aLink.click();
			this.setState({
				tarloading: false
			});
			document.body.removeChild(aLink);
		}, 1000);
	}
	render() {
		return (
			<div>
				<Row type="flex" justify="end" style={{ marginBottom: '.5em' }}>
					<Button
						type="primary"
						style={{ marginRight: '.5em' }}
						onClick={this.onDownload.bind(this)}
						loading={this.state.tarloading}
						disabled={this.state.selectedRowKeys.length === 0}
					>
						{this.state.tarloading ? '资源打包中' : '批量下载'}
					</Button>
					<Button type="danger" disabled={this.state.selectedRowKeys.length === 0} onClick={this.onDelete.bind(this)}>
						删除
					</Button>
				</Row>
				<div style={{ overflowX: 'scroll' }}>
					<Table
						style={{ backgroundColor: '#fff', minWidth: '800px' }}
						pagination={false}
						dataSource={this.state.dataSource}
						columns={colunms}
						rowSelection={{
							onChange: this.onChange.bind(this)
						}}
					/>
				</div>
			</div>
		);
	}
}
